@charset "utf-8";
/* CSS Document */
/* CSS Document */
/*============== ResetCSS ================*/





.listweb20 { margin:20px 0;}
.listweb20 ul.web20 {}
.listweb20 ul.web20 li.item { float:left; width:333px; text-align:center; height:314px;position:relative;}
.listweb20 ul.web20 li.item .itemimg { width:302px; height:250px; position:relative; margin:0 auto; overflow:hidden; border:1px solid #e1e1e1}
.listweb20 ul.web20 li.item .itemimg img { width:300px; max-height:375px;}
.listweb20 ul.web20 li.item .itemimg .overlay {width:301px; height:250px; display:none; position:absolute; left:0; top:0; background:url(../images/graphics/overlay.png) no-repeat}
.listweb20 ul.web20 li.item .itemimg:hover .overlay { display:inherit}
.listweb20 ul.web20 li.item span.imgicon {background:url(../images/graphics/bg-shadow.png) no-repeat bottom; bottom:47px; right:8px; width:306px; height:16px; position:absolute}
.listweb20 ul.web20 li.item .itembtn { clear:both;margin:10px 16px;}
.listweb20 ul.web20 li.item .itembtn a.title { float:left; font-family:Georgia, "Times New Roman", Times, serif; font-size:14px; color:#333; font-weight:normal; line-height:28px;}
.listweb20 ul.web20 li.item .itembtn ul.btn { position:absolute; top:71%; right:18px;}
.listweb20 ul.web20 li.item .itembtn ul.btn li {float:left}
.listweb20 ul.web20 li.item .itembtn ul.btn li a {color:#fff; padding:8px 15px; display:block; font-size:11px; font-weight:bold}
.listweb20 ul.web20 li.item .itembtn ul.btn li a.demo { background:#2ea5cc}
.listweb20 ul.web20 li.item .itembtn ul.btn li a.reg { background:#e35d5d;}
.listweb20 ul.web20 li.item .itembtn ul.btn li a:hover { background:#666}

.web_focus ul li a img { max-width:235px; max-height:195px;box-shadow: 0 0 3px #666666; padding:2px;}
.web_focus ul li { position:relative; text-align:center; padding:2px 0;}
.web_focus ul li span.overlay { width:240px; height:200px; display:none; position:absolute; top:0; right:0;background:url(../img/giaodien/iconweb4s.png) no-repeat}
.web_focus ul span h2 {  font-size:12px; color:#555; padding:5px 0; text-align: center; font-weight:bold;}
.web_focus ul span slide h2 {  font-size:12px; color:#555; padding:5px 0; text-align: center; font-weight:bold;}
.web_focus span.icon { position:absolute; display:block; width:50px; height:50px;background:url(../img/giaodien/iconweb4s.png) no-repeat; top:45px; right:5px;}
.web_focus ul li:hover span.overlay { display:inherit}
.web_focus { position:relative; margin-bottom:10px;}
.web_focus .titleside { font-size:18px; color:#4C5760; line-height:32px; font-weight:bold; padding-bottom:5px;}



 

/**********************************************************/

.list_category {width: 100%; height:130px;}
.list_category ul li{float:left;width: 115px; height: 100px; margin:10px 0 0 26px; display:block; text-align:center;transition: background-color 0.5s ease 0s;}
.list_category ul li a span {float: left; width:100px; height:100px; border: 2px solid #ccc; border-radius: 50px; -moz-border-radius: 50px; -webkit-border-radius: 50px; background-image:url(../images/graphics/img_store.png); background-color: #c01b88 ; background-repeat:no-repeat; background-position:0 0;}
.list_category ul li a:hover span {transition: background-color 0.8s ease 0s;}
.list_category ul li a:hover .icon{ background-color:#87115f}
.list_category ul li a .icon1{background-position: 0 -208px; background-color:#07a0c9}
.list_category ul li a:hover .icon1 { background-color:#005c75}
.list_category ul li a .icon2{background-position: 0 -312px; background-color:#29ad61}
.list_category ul li a:hover .icon2 { background-color:#156a39}
.list_category ul li a .icon3{background-position: 0 -416px; background-color:#ffcc00}
.list_category ul li a:hover .icon3 { background-color:#9a7b01}
.list_category ul li a .icon4{background-position: 0 -520px; background-color:#316dab}
.list_category ul li a:hover .icon4 { background-color:#25507d}
.list_category ul li a .icon5{background-position: 0 -102px; background-color:#e84c3d}
.list_category ul li a:hover .icon5 { background-color:#a0362c}
.list_category ul li a .icon6{background-position: 0 -624px; background-color:#ff6c00}
.list_category ul li a:hover .icon6 { background-color:#a44500}
.list_category ul li .active {border-bottom: 3px solid #ccc;}
.ten_giaodien{
    margin-left: 50px;
    font-size: 16px;
    font-weight: bold;
}
